import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import '../../theme/theme_provider.dart';


class ThemeSetting extends StatelessWidget {
  const ThemeSetting({super.key});

  String changeWord(String mode){
    String ret='';
    switch(mode){
      case "system":
        ret = "跟随系统";
        break;
      case "light":
        ret = "浅色主题";
        break;
      case "dark":
        ret = "深色主题";
        break;
      default :
        ret = "跟随系统";
    }
    return ret;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('主题设置'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () {
                // 仅切换主题
                Provider.of<ThemeProvider>(context, listen: false).toggleTheme(context);
                // 添加成功反馈
              },
              child: const Text('切换主题模式'),
            ),
            const SizedBox(height: 30,),
            const Text('当前主题模式：',style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
            Consumer<ThemeProvider>(
              builder: (context, themeProvider, child) {
                return Text(
                  changeWord(themeProvider.themeMode.toString().split('.').last),
                  style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
                );
              },
            ),
            const SizedBox(height: 20),
            // 添加主题预览卡片
            Consumer<ThemeProvider>(
              builder: (context, themeProvider, child) {
                return ThemePreviewCard(themeMode: themeProvider.themeMode);
              },
            ),
          ],
        ),
      ),
    );
  }
}

// 新增主题预览卡片组件
class ThemePreviewCard extends StatelessWidget {
  final ThemeMode themeMode;

  const ThemePreviewCard({
    super.key,
    required this.themeMode,
  });

  @override
  Widget build(BuildContext context) {
    return Card(
      margin: const EdgeInsets.symmetric(horizontal: 20),
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: [
            Text(
              '主题预览',
              style: TextStyle(
                fontSize: 16,
                fontWeight: FontWeight.bold,
                color: Theme.of(context).colorScheme.secondary,
              ),
            ),
            const SizedBox(height: 10),
            Container(
              height: 60,
              decoration: BoxDecoration(
                color: Theme.of(context).colorScheme.surface,
                borderRadius: BorderRadius.circular(8),
              ),
              child: Center(
                child: Text(
                  '内容区域示例',
                  style: TextStyle(
                    color: Theme.of(context).colorScheme.onSurface,
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}